<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/common/taglibs.jsp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <style type="text/css">
        .tree {
            display: inline;
            float: left;
            margin-left: 10px;
            margin-right: 10px
        }
    </style>
    <script type="text/javascript" src="${ctx}/js/jstree/jquery.jstree.js"></script>
    <script type="text/javascript" src="${ctx}/js/menuTree.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            var updateURL = "/security/authority!updateAuthority.action";
            var menuTree = initMenuTree(${authorityJson}, '${ctx}', updateURL);
            var currentObj;
            menuTree.bind("select_node.jstree", function (event, data) {
                currentObj =data.rslt.obj;
                $("#authorityId").val(currentObj.attr("id").replace("node_", ""));
                var resourceId =  currentObj.attr("resourceIds");
                $("#resourceId").val(resourceId);

                if(resourceId==null || resourceId==""){
                    $('#inputForm #resourceType').val("");
                    $('#inputForm #title').val("");
                    $('#inputForm #url').val("");
                    $('#inputForm #limitSql').val("");
                    $("#resourceType").change();
                      return;
                }

                $.ajax({
                    type:"post",
                    data:{"resourceId":resourceId},
                    url: "${ctx}/security/authority!getResource.action",
                    error:function(error) {
                        alert(error);
                    } ,
                    success:function (output) {
                        if(output==null || output==""){
                            return;
                        }
                        $('#inputForm #resourceType').val(output.resourceType);
                        $('#inputForm #title').val(output.title);
                        $('#inputForm #url').val(output.url);
                        $('#inputForm #limitSql').val(output.limitSql);
                        $("#resourceType").change();
                    }
                });

            });

            $("#saveButton").click(function(){
                var jsonData = $("#inputForm").serialize();
                $.ajax({
                    type:"post",
                    url: "${ctx}/security/authority!saveResource.action",
                    data: jsonData,
                    success:function(output){
                        $('#inputForm #resourceId').val(output.id);
                        $(currentObj).attr("resourceIds",output.id);
                    }
                });
            }) ;

            $("#resourceType").change(function(e) {
                if ($("#resourceType").val() == "1") {
                    $("#urlSection").show();
                    $("#limitSqlSection").hide();
                } else if ($("#resourceType").val() == "2")  {
                    $("#urlSection").hide();
                    $("#limitSqlSection").show();
                }else{
                    $("#urlSection").hide();
                    $("#limitSqlSection").hide();
                }
            }).change();
        });
    </script>
    <meta name="menu" content="authorityManage"/>
</head>

<body>
<div id="treeMenu" class="tree" style="width: 400px"></div>
<div>
    <form action="#" id="inputForm">
        <input type="hidden" name="authorityId" id="authorityId">
        <input type="hidden" name="resourceId" id="resourceId">

        <p>
            <label for="resourceType">资源类型: </label>
            <code:dispCodeList codeType="RESOURCE_TYPE" id="resourceType" name="resourceType" cssClass="input-medium" displayHeader="true"/>
        </p>

        <p>
            <label for="title">资源标题: </label>
            <input name="title" id="title" type="text" class="input-medium"/>
        </p>

        <p id="urlSection">
            <label for="url">URL: </label>
            <input name="url" id="url" type="text" class="input-medium"/>
        </p>

        <p id="limitSqlSection">
            <label for="limitSql">SQL: </label>
            <textarea name="limitSql" id="limitSql" cols="60" rows="10" class="input-big"></textarea>
        </p>

        <p>
            <a class="button" id="saveButton"><span>保存</span></a>
        </p>
    </form>
</div>
</body>
</html>
